let rank = {
    1: {name: "goldin", tasks: ['1a', '2b', '15a'] }
};

const render_rank = () => {
    for (let id in rank) {
        let person = rank[id];
        const container = document.createElement("div");
        container.className = "person__container"

        const name = document.createElement("span");
        name.innerText = person.name;
        container.appendChild(name);

        for (let task_name in person.tasks) {
            const task = document.createElement("span");
            task.className = "task";
            task.innerText = task_name;
            container.appendChild(task);
        }
        document.getElementById("top").appendChild(container);
    }
};

console.log("HELLOW");
render_rank();
async function claim_task(id, task) {
    const r = await fetch("api/claim_task", {
        method: 'POST',
        headers: {'Content-Type': 'text/json'},
        body: "{ id: 1, task: '1a' }"
    });
    const json = await r.json();
    console.log(json);
}

claim_task(1, '2a');
